<!--* 日期组件-->
<!--* @module src/components/public-->
<!--* @desc search 搜索框/ format 转义-->
<!--* @author chenyi-->
<!--* @date 2019年09月19日17:22:43-->

<template>
  <div class="inline-block">
    <el-date-picker
      v-if="type==='search'"
      v-model="dateValue"
      type="daterange"
      align="left"
      unlink-panels
      range-separator="至"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
      :picker-options="pickerOptions">
    </el-date-picker>
    <span v-if="type === 'format'">{{result}}</span>
  </div>

</template>

<script>

  export default {
    name: 'es-time',
    props: {
      value: [Array,String,Number]//日期/时间戳
      , type: String//search 时间搜索框  format 时间转换
      , format: String//格式
    },
    model: {
      event: 'changeValue'
    },
    data: function () {
      return {
        result: '',
        dateValue:this.value,
        pickerOptions: {
          shortcuts: [{
            text: '今天',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '昨天',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24);
              end.setTime(end.getTime() - 3600 * 1000 * 24);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '本月',
            onClick(picker) {
              const date = new Date();
              const y = date.getFullYear();
              const m = date.getMonth();
              const start = new Date(y,m,1);
              const end = new Date(y,m+1,0);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '今年',
            onClick(picker) {
              const date = new Date();
              const y = date.getFullYear();
              const start = new Date(y,0,1);
              const end = new Date(y,12,0);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '去年',
            onClick(picker) {
              const date = new Date();
              const y = date.getFullYear();
              const start = new Date(y-1,0,1);
              const end = new Date(y-1,12,0);
              picker.$emit('pick', [start, end]);
            }
          }
          ]
        },
      }
    },
    mounted () {
      //如果是时间转换
      if(this.type==="format"){
        if (!this.value) {
          return '-'
        }
        let format = this.format || 'yyyy-MM-dd hh:mm:ss';
        this.result = this.$t.dateFormat(this.value, format)
      }
    },
    watch:{
      value(val) {
        this.dateValue = val
      },
      dateValue(val,oldVal) {
        this.$emit('changeValue', val);
      }
    }

  }
</script>

<style scoped>

</style>
